import React, { Component } from 'react'

class Header extends Component {
  state = {
    username: ''
  }
  componentDidMount () {
    this.setState({
      username: localStorage.getItem('username')
    })
  }
  render () {
    const { username } = this.state
    return (
      <h1>header - { username }</h1>
    )
  }
}

class Content extends Component {
  state = {
    username: ''
  }
  componentDidMount () {
    this.setState({
      username: localStorage.getItem('username')
    })
  }
  render () {
    const { username } = this.state
    return (
      <div>content - { username }</div>
    )
  }
}
export default class App extends Component {
  render() {
    return (
      <div>
        <Header />
        <Content />
      </div>
    )
  }
}
